<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <title>Sass:Syntactically Awesome Style Sheets</title>
    <meta content="Syntactically Awesome Style Sheets" name="description">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
   <div class="page">
       <div class="alert stickers">
           <div class="container">
               <p>
                   <strong>Sass stands with trans detainees.</strong>
                   <a href="https://www.tfaforms.com/369889">
                      Donate to the Trans Justice Funding Project. 
                   </a>
               </p>
           </div>
       </div>
       <div class="pop-stripe"></div>
       <header class="banner" role="banner">
           <div class="container">
               <h1 class="site-brand">
                   <a href="http://www.zhuchuli.cn:4000/hexo-theme-huxblog/">
                      <img height="48" src="images/logo-b6e1ef6e.svg" alt="Sass">
                   </a>
               </h1>
               <nav class="navigation collapse" role="navigation">
                    <ul>
                        <li><a href="./install.html">Install</a></li>
                        <li><a href="./guide.html">Learn Sass</a></li>
                        <li><a href="./blog.html">Blog</a></li>
                        <li><a href="./documentation.html">Documentation</a></li>
                        <li><a href="./community.html">Get Involved</a></li>
                        <li><a href="./libsass.html">libSass</a></li>
                    </ul>
               </nav>
               <div class="banner-toggle">
                   <button data-target=".navigation" data-toggle="collapse" type="button">
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                   </button>
               </div> 

           </div>
       </header>
       <div class="page-header">
           <div class="container">
               <h1> Install Sass </h1>
           </div>
       </div>
       <div class="install">
          <div class="container">
            <div class="left-grid_column">
                <h2>Applications</h2>
                <p>
                    <img src="./images/mouse-3f5cd091.svg" alt="Mouse">
                </p>
                <p>There are a good many applications that will get you up and&nbsp;running with Sass in a few minutes for Mac, Windows, and Linux. You can&nbsp;download most of the applications for free but a few of them are paid&nbsp;apps <small>(and totally worth it)</small>.</p>
                <ul> 
                    <li> <a href="https://codekitapp.com/">CodeKit</a>&nbsp;(Paid) Mac </li> 
                    <li> <a href="http://www.vanamco.com/ghostlab/">Ghostlab</a>&nbsp;(Paid) Mac&nbsp;Windows </li> <li> <a href="http://hammerformac.com/">Hammer</a>&nbsp;(Paid) Mac </li> 
                    <li> <a href="http://livereload.com/">LiveReload</a> (Paid, Open&nbsp;Source) Mac&nbsp;Windows </li> <li> <a href="https://prepros.io/">Prepros</a>&nbsp;(Paid) Mac&nbsp;Windows Linux </li> 
                    <li> <a href="http://scout-app.io/">Scout-App</a> (Free, Open&nbsp;Source) Windows&nbsp;Linux Mac </li> 
                </ul>
            </div>
            <div class="right-grid_column">
                <h2>Command&nbsp;Line</h2> 
                <p><img alt="Keyboard" src="./images/keyboard-4d5a3e1a.svg"></p> 
                <p>When you install Sass on the command line, you'll be able to run&nbsp;the <code>sass</code> executable to compile <code>.sass</code> and <code>.scss</code> files to <code>.css</code>&nbsp;files. For&nbsp;example:</p> 
                <pre class="highlight plaintext"><code>sass source/stylesheets/index.scss build/stylesheets/index.css</code></pre> 
                <p>First install Sass using one of the options below, then&nbsp;run <code>sass --version</code> to be sure it installed correctly. If it did, this&nbsp;will include <code>1.30.0</code>. You can also run <code>sass --help</code> for&nbsp;more information about the command-line&nbsp;interface.</p> 
                <p>Once it's all set up, <strong>go and play</strong>. If you're brand new&nbsp;to Sass we've set up some resources to help you learn pretty darn&nbsp;quick.</p> 
                <p><a href="/guide" class="sl-c-button sl-c-button--primary">Learn More About&nbsp;Sass</a></p> 
                <dl> 
                    <dt>Install Anywhere&nbsp;(Standalone)</dt> 
                    <dd> You can install Sass on Windows, Mac, or Linux by downloading&nbsp;the package for your operating&nbsp;system <a href="https://github.com/sass/dart-sass/releases/tag/1.30.0">from GitHub</a>&nbsp;and <a href="https://katiek2.github.io/path-doc/">adding it to&nbsp;your <code>PATH</code></a>. That’s all—there are no external dependencies&nbsp;and nothing else you need to&nbsp;install. </dd>
                    <dt>Install Anywhere&nbsp;(npm)</dt> 
                    <dd> 
                        <p> If you use Node.js, you can also install Sass&nbsp;using <a href="https://www.npmjs.com/">npm</a> by&nbsp;running </p> 
                        <pre>npm install -g sass</pre> 
                        <strong>However, please note</strong> that this will install the&nbsp;pure JavaScript implementation of Sass, which runs somewhat slower than&nbsp;the other options listed here. But it has the same interface, so it’ll&nbsp;be easy to swap in another implementation later if you need a bit&nbsp;more speed! 
                    </dd> 
                    <dt>Install on Mac <span class="caps">OS</span> X or Linux&nbsp;(Homebrew)</dt> 
                    <dd>
                         <p> If you use <a href="https://brew.sh/">the Homebrew&nbsp;package manager</a> for Mac <span class="caps">OS</span> X or Linux, you can install Dart Sass&nbsp;by running </p> <pre>brew install sass/sass/sass</pre> 
                    </dd> 
                </dl> 
            </div>
          </div>
       </div>
       <div class="alert release">
            <div class="container">
                <ul>
                    <li>Current Release：<span class="release-name">Select Steve（3.4.17）</span></li>
                    <li><a href="documentation/file.SASS_CHANGELOG.html">Release Notes</a></li>
                    <li><a href="https://github.com/sass/sass">Fork on Github</a></li>
                </ul>
            </div>
       </div>
   </div>
   <footer class="contentinfo" role="contentinfo">
        <nav class="container">
            <ul>
                <li class="contentinfo-legal">
                    <p>
                        Sass © 2006–2020  
                        <a href="http://www.hamptoncatlin.com/">Hampton Catlin</a>,
                        <a href="http://next-3.cpm">Natalie Weizenbaum</a>,
                        <a href="http://chriseppstein.github.io/">Chris&nbsp;Eppstein</a>,
                        and&nbsp;numerous&nbsp;contributors.
                    </p>
                    <p>
                        It is available for use and modification under the 
                        <a href="http://sass-lang.com/docs/yardoc/file.MIT-LICENSE.html">MIT&nbsp;License</a>.
                    </p>
                </li>
                <li class="contentinfo-tools">
                    <ul>
                        <li><a href="https://github.com/sass/sass">Sass Repo</a></li>
                        <li><a href="https://github.com/sass/sass-site">Website Repo</a></li>
                        <li><a href="/styleguide">Style Guide</a></li>
                        <li><a href="/community-guidelines">Community Guidelines</a></li>
                        <li><a href="https://gitee.com/chu_li_zhu">Gitee</a></li>
                    </ul>
                </li>
                <li class="contentinfo-social">
                    <a class="twitter-follow-button"  data-show-count="false" data-size="large" href="https://twitter.com/SassCSS">Follow @SassCSS</a>
                </li>
            </ul>
        </nav>
   </footer>
</body>
</html>